// 图片上传demo
function uploadimg() {
    var $ = jQuery;
    //建立html
    var file_count = 0;
    var picker = "add_file_button";
    var add_files;
    //
    var
    // 优化retina, 在retina下这个值是2
    ratio = window.devicePixelRatio || 1,
    // Web Uploader实例
    uploader;

    // 初始化Web Uploader
    uploader = WebUploader.create({
        // 自动上传。
        auto: true,
        // swf文件路径
        swf: '/static/webuploader/Uploader.swf',
        threads:1,//上传并发数。允许同时最大上传进程数。 这里建议设置为1，否则上传后的文件顺序和本地的不一样，如（1,jpg,2,jpg,3.jpg）上传到服务器口顺序可能是(2.jpg,1,jpg,3.jpg)
        // 文件接收服务端。
        server: upload_url,
        // 选择文件的按钮。可选。
        // 内部根据当前运行是创建，可能是input元素，也可能是flash.
        pick: {
            id: "#" + picker,
        },
        chunked:true,//开启分片上传
        chunkSize:1024*1024*5,//如果要分片，分多大一片？ 默认大小为5M
        duplicate: true, //可重复上传
        fileSingleSizeLimit:upload_accept.maxSize*1024*1024,//验证单个文件大小是否超出限制, 超出则不允许加入队列。
        // 只允许选择文件，可选。
        accept: upload_accept,
		compress :{
			width: imgwidth>0?imgwidth:2000,
			height: imgheight>0?imgheight:99999,
			// 图片质量，只有type为`image/jpeg`的时候才有效。
			quality: 100,
			// 是否允许放大，如果想要生成小图的时候不失真，此选项应该设置为false.
			allowMagnify: false,
			// 是否允许裁剪。
			crop: false,
			// 是否保留头部meta信息。
			preserveHeaders: true,
			// 如果发现压缩后文件大小比原来还大，则使用原来图片
			// 此属性可能会影响图片自动纠正功能
			noCompressIfLarger: true,
			// 单位字节，如果图片大小小于此值，不会采用压缩。
			compressSize: 0
		}
    });
    //当一组文件加入时触发
    uploader.on('filesQueued', function (files) {
        uploader.sort(function(fiels) {
            return -1;//设置文件上传顺序，这里一定要加上，如本地文件上为1,2,3如不加上，上传后在数据库的顺序是3，2，1，加上后就可和本地一样了
        });
        add_files = files.length;
        //打开上传窗口
        $(".upload_box").show();
    });
    uploader.addButton({
        id: '#btnContainer',
      
    });
	//文件上传前向服务器发送请示，看是否允许上传，如果返回status为0则中断上传
	uploader.on( 'uploadAccept', function( file, response ) {
		if(!response.status){			
            var $li = $('#upload_list_' + file.file.id);
            $li.find('.ckf-upload-item').addClass('ckf-upload-item-error');
            $li.find('.ckf-progress').addClass('ckf-progress-error');
            $li.find('.ckf-upload-message').html(response.info);
			uploader.cancelFile( file.file );
		}
	});	  
    // 当有文件添加进来的时候
    uploader.on('fileQueued', function (file) {	
        var $li = $('<li data-icon="ckf-cancel" class="ui-li-has-alt upload_list_li" id="upload_list_' + file.id + '"><a class="ckf-upload-item ui-btn" style="margin:0px;"><h3>' + file.name + '</h3><div class="ckf-progress"><div class="ckf-progress-bar" style="width:5%;"></div></div><p class="ckf-upload-message"><span style="color:#999">等待上传...</span></p></a></li>');
        $("#upload_list").prepend($li);		
        file_count++;
        $("#file_count").html(file_count);
        open_uploading();//打开进度窗口	
    });


    // 文件上传过程中创建进度条实时显示。
    uploader.on('uploadProgress', function (file, percentage) {
        var $li = $('#upload_list_' + file.id),
            $percent = $li.find('.ckf-progress-bar');
        $percent.css('width', percentage * 100 + '%');
		$li.find('.ckf-upload-message').html("");//正在上传的将，等待上传...清空

        //剩余数量
        var waiting_num = $(".upload_list_li").length;
        var successful_num = add_files - waiting_num;
        var all_percent = ((successful_num + percentage) / add_files) * 100;
        $(".all-ckf-progress-bar").css("width", all_percent + "%");
        $(".ckf-upload-status").html(successful_num + "/" + add_files);
		$("#file_count").html(waiting_num);

    });
    // 文件上传成功 删除状态框
    uploader.on('uploadSuccess', function (file, result) {
        if (result.status == 0) {
            var $li = $('#upload_list_' + file.id);
            $li.find('.ckf-upload-item').addClass('ckf-upload-item-error');
            $li.find('.ckf-progress').addClass('ckf-progress-error');
            $li.find('.ckf-upload-message').html(result.info);
        } else {
            file_count--;
            $('#upload_list_' + file.id).remove();
            //视图增加图片
            page = 0;
            getlist(result.id);//重新加载列表				
        }

    });
    // 文件上传失败，现实上传出错。
    uploader.on('uploadError', function (file, reason) {
        var $li = $('#upload_list_' + file.id);
        $li.find('.ckf-upload-item').addClass('ckf-upload-item-error');
        $li.find('.ckf-progress').addClass('ckf-progress-error');
        $li.find('.ckf-upload-message').html("上传错误");

    });
    // 列表上传完成触发
    uploader.on('uploadFinished', function () {
        var fail_li = $(".upload_list_li").length;
        if (fail_li == 0) {
            $(".ckf-upload-status").html("所有文件上传成功");
            uploader.reset();
            remove_uploading();
        } else {
        }

    });
    // 完成上传完了，成功或者失败，先删除进度条。
    uploader.on('uploadComplete', function (file, result) {
    });
    //
    uploader.on("error", function (type) {
        if (type == "Q_TYPE_DENIED") {
            alert("请上传" + upload_accept.extensions + "格式文件");
        } else if (type == "Q_EXCEED_SIZE_LIMIT") {
            alert("文件大小不能超过"+upload_accept.maxSize+"M");
        } else if (type == "F_EXCEED_SIZE") {
            alert("单个文件大小不能超过"+upload_accept.maxSize+"M");
        } else {
            alert("上传出错！请检查后重新上传！错误代码" + type);
        }
    });
}

var uploading_status = 0;

//打开上传文件窗口
function open_upload_box() {
    $(".ckf-progress-bar").css("width", "0%");
    $(".ckf-upload-status").html("选择文件上传");
    uploadimg();
    $(".upload_box").show();
}
//第一个上传按钮直接显示
$(function(){
    $(".ckf-progress-bar").css("width", "0%");
    $(".ckf-upload-status").html("选择文件上传");
    uploadimg();
})

//关闭上传文件窗口
function close_upload_box() {
    $(".upload_box").hide();
}


//移出上传详情窗口
function remove_uploading() {
    $("#uploading_status").animate({"width": "0em"}, function () {
        $("#uploading_status").hide();
    });
    $(".ui-panel-wrapper").animate({"margin-right": "17em"});
    uploading_status = 0;
}
//打开上传详情窗口
function open_uploading() {
    $("#uploading_status").show();
    $("#uploading_status").animate({"width": "17em"});
    $(".ui-panel-wrapper").animate({"margin-right": "34em"});
    uploading_status = 1;
}
//根据情况打开或关闭上传详情窗口
function check_open_uploading() {
    if (!uploading_status) {
        open_uploading();
    } else {
        remove_uploading();
    }
}
